
<!doctype html>
<html>
<head>
    <!--Import materialize.css-->
    <!--<link type="text/css" rel="stylesheet" href="node_modules/materialize-css/bin/materialize.css"  media="screen,projection"/>-->
    <!--<link href="http://fonts.useso.com/icon?family=Material+Icons" rel="stylesheet">-->
    <link href="asset/materialize-css/bin/ghpages-materialize.css"  type="text/css" rel="stylesheet" media="screen,projection">
    <link href="css/base.css" rel="stylesheet">
    <!--<link href="http://materializecss.com/css/prism.css" rel="stylesheet">-->

    <meta charset="UTF-8">
    <!--Let browser know website is optimized for mobile-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

</head>


<body>


<header>
    <ul id="slide-out" class="side-nav fixed ">
        <!--<a id = "main-log" href="#" class="brand-logo" style="padding-left: 10px">等待接入新设备</a>-->
        <li class="logo">
            <a id="logo-container" href="http://materializecss.com/" class="brand-logo">
                <img id="front-page-logo" src="asset/icon/app.png"/>
            </a>
        </li>

        <li class="bold active">
            <a href="app.html"  class="waves-effect waves-teal">
                <i class="material-icons left li-icon">track_changes</i>自动测试

            </a>
        </li>
        <li class="bold">
            <a href="firmware.html"  class="waves-effect waves-teal">
                <i class="material-icons left li-icon">open_in_browser</i>烧入固件
            </a>
        </li>
        <li class="bold">
            <a href="javascript:void(0)"  class="waves-effect waves-teal">
                <i class="material-icons left li-icon">assignment</i>历史日志
            </a>
        </li>
        <li class="bold">
            <a href="#task-setting-modal" id="task-setting-btn"  class="waves-effect waves-teal">
                <i class="material-icons left li-icon">settings</i>设置
            </a>
        </li>
        <li class="bold">
            <a href="#modal1" id="setting-btn"  class="waves-effect waves-teal">
                <i class="material-icons left li-icon" id="plug-status ">settings_input_hdmi</i>usermodel1
            </a>
        </li>
    </ul>
    <a href="#"  id="nav-button-collapse" data-activates="slide-out" class="button-collapse waves-effect waves-light circle hide-on-large-only ">
        <i class="mdi-social-notifications-off"></i>
    </a>

</header>
<!--<nav>-->
    <!--<div class="nav-wrapper green">-->
        <!--<a id = "main-log" href="#" class="brand-logo" style="padding-left: 10px">等待接入新设备</a>-->
    <!--</div>-->

<!--</nav>-->

<main>

    <div class="row" >
        <div class="col s12  green white-text">
            <div  id="main-log" >
                <h4 class="">&nbsp</h4>
            </div>
        </div>
    </div>
        <!--</div>-->
    <div class="">
        <div class="row">
            <div class="col s6">
                <div class="card ">
                    <div class="card-content " >
                        <span class="card-title black-text">日志</span>
                        <div class="log-content">
                            <p> <span class=" green lighten-5">[ 2015-08-26 09:38:58 ]</span> 成功连接到</p>
                        </div>
                    </div>
                    <div class="card-action">
                        <a href="#" id="clean-log">清空日志</a>
                    </div>
                </div>

            </div>
            <div class="col s6">
                <ul class="collection" id="task-collection">

                </ul>
            </div>
        </div>

    </div>
    <li class="collection-item avatar hide " id="base-task">
        <i class="material-icons circle"></i>
        <span class="title"></span>
        <p class="info"><br>等待测试
        </p>
        <!--<div class="sparkline" style="position: relative;top :-50px;left:100px"></div>-->
        <!--<div class="sparkline" style="position: relative;top :-50px;left:100px"></div>-->
        <div class="progress task-process hide">
            <div class="indeterminate"></div>
        </div>

    </li>
    <!-- Modal Structure -->
    <div id="modal1" class="modal">
        <div class="modal-content">
            <form>
                <div class="row">

                    <div class="input-field col s9">
                        <select id="serial-select">
                        </select>
                        <label>串口选择</label>
                    </div>
                </div>
            </form>
        </div>
        <div class="modal-footer">
            <a href="#!" id="setting-confirm-btn" class=" modal-action  waves-effect waves-green btn-flat">确定</a>
            <a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">取消</a>
        </div>
    </div>

    <!-- Modal Structure -->
    <div id="env-setting-modal" class="modal">
        <div class="modal-content">
            <form>
                <div class="row">

                    <div class="input-field col s6">
                    </div>
                </div>
            </form>
        </div>
        <div class="modal-footer">
            <a href="#!" id="env-confirm-btn" class=" modal-action waves-effect waves-green btn-flat">确定</a>
            <a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">取消</a>
        </div>
    </div>

    <div id="task-setting-modal" class="modal">
        <div class="modal-content">
            <form>
                <div class="row">
                    <div class="row" data-task-id="1">
                        <div class=" input-field col s4" >
                            <input type="checkbox" class="filled-in" id="filled-in-box1" checked="checked" data-open-option="1" />
                            <label for="filled-in-box1">MPU6000 基础测试</label>
                        </div>
                    </div>
                    <div class="row" data-task-id="2">
                        <div class=" input-field col s4">
                            <input type="checkbox" class="filled-in" id="filled-in-box2" checked="checked" data-open-option="1"  />
                            <label for="filled-in-box2">MPU6000 Bad Acc</label>
                        </div>
                        <div class="input-field col s4">
                            <input id="mpu6000_bad_acc_test_count" type="number" class="validate" data-is-option="1" name="count" default-value="20">
                            <label for="mpu6000_bad_acc_test_count">测试次数</label>
                        </div>
                    </div>
                    <div class="row" data-task-id="3">
                        <div class=" input-field col s4">
                            <input type="checkbox" class="filled-in" id="filled-in-box3" checked="checked" data-open-option="1"  />
                            <label for="filled-in-box3">MS5611 稳定测试</label>
                        </div>
                        <div class="input-field col s4" >
                            <input id="ms5611_test_time" type="number" class="validate" data-is-option="1" name="time" default-value="1" >
                            <label for="ms5611_test_time">测试时间（分钟）</label>
                        </div>
                    </div>
                    <div class="row" data-task-id="4">
                        <div class=" input-field col s4">
                            <input type="checkbox" class="filled-in" id="filled-in-box4" checked="checked" data-open-option="1"  />
                            <label for="filled-in-box4">lsm303d Bad Acc</label>
                        </div>
                        <div class="input-field col s4" >
                            <input id="lsm303d_test_count" type="number" class="validate" data-is-option="1" name="count" default-value="20" >
                            <label for="lsm303d_test_count">测试次数</label>
                        </div>
                    </div>
                    <div class="row" data-task-id="5">
                        <div class=" input-field col s4">
                            <input type="checkbox" class="filled-in" id="filled-in-box5" checked="checked" data-open-option="1"  />
                            <label for="filled-in-box5">LED 测试</label>
                        </div>
                        <div class="input-field col s4" >
                            <input id="led_test_time" type="number" class="validate" data-is-option="1" name="time" default-value="10" >
                            <label for="led_test_time">测试时间（秒钟）</label>
                        </div>
                    </div>
                    <div class="row" data-task-id="6">
                        <div class=" input-field col s4">
                            <input type="checkbox" class="filled-in" id="filled-in-box6" checked="checked" data-open-option="1"  />
                            <label for="filled-in-box5">Buzzer 测试</label>
                        </div>
                        <div class="input-field col s4" >
                            <input id="buzzer_test_time" type="number" class="validate" data-is-option="1" name="time" default-value="10" >
                            <label for="buzzer_test_time">测试时间（秒钟）</label>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="modal-footer">
            <a href="#!" id="task-confirm-btn" class=" modal-action  waves-effect waves-green btn-flat">确定</a>
            <a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">取消</a>
        </div>
    </div>
</main>

<script>
    var gui = require('nw.gui');

    // Create menu
    var menu = new gui.Menu({ type: 'menubar' });

    // create MacBuiltin
    menu.createMacBuiltin('泊志自动测试',{
        hideEdit: false,
        hideWindow: false,
        version: "0.1"
    });

    // Append Menu to Window
    gui.Window.get().menu = menu;
</script>

<!--Import jQuery before materialize.js-->
<script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="asset/materialize-css/bin/materialize.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/settings.js"></script>
<script type="text/javascript" src="js/ui.js"></script>
<script type="text/javascript" src="js/task.js"></script>
<script type="text/javascript" src="js/serial.js"></script>
<script type="text/javascript" src="js/app.js"></script>

<script>
    $('.button-collapse').sideNav({'edge': 'left'});

</script>
</body>
</html>
